<script setup lang="ts">
</script>

<template>
  <div class="findNoteContainer">
    <div class="card-list">
      <div class="card-item">
        <img
          src="https://img1.baidu.com/it/u=2755334673,930255699&fm=253&fmt=auto&app=138&f=JPEG?w=483&h=500"
          alt="朋友圈.jpg"
        />
        <div class="desc two-overflow">
          奥术大师抵抗力喀斯柯达喀斯柯达开卡时看到卡开始看的加大烧烤店看看
        </div>
        <div class="userName">氨基酸大家</div>
        <div class="time">2020.03.01</div>
      </div>
      <div class="card-item">
        <img
          src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2Fa89468e5-9c71-b438-d7f5-e32f4b380021%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1649158163&t=0137db0e3435fabc761ddaa0dc20c635"
          alt="朋友圈.jpg"
        />
        <div class="desc two-overflow">
          奥术大师抵抗力喀斯柯达喀斯柯达开卡时看到卡开始看的加大烧烤店看看
        </div>
        <div class="userName">氨基酸大家</div>
        <div class="time">2020.03.01</div>
      </div>
      <div class="card-item">
        <img
          src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimages.nvyoubuluo.com%2Fnv%2F2020%2F11%2F20201127103411902.jpg&refer=http%3A%2F%2Fimages.nvyoubuluo.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1649158163&t=9299a2682643897c19cbfdeec7665dbc"
          alt="朋友圈.jpg"
        />
        <div class="desc two-overflow">
          奥术大师抵抗力喀斯柯达喀斯柯达开卡时看到卡开始看的加大烧烤店看看
        </div>
        <div class="userName">氨基酸大家</div>
        <div class="time">2020.03.01</div>
      </div>
    </div>
  </div>
</template>

<style lang="less">
.findNoteContainer {
  margin-bottom: 100px;
  .card-list {
    display: grid;
    grid-template-columns: repeat(2, 50%);
    .card-item {
      margin: 10px;
      border-radius: 10px;
      box-shadow: 1px 1px 4px 1px #999;
      overflow: hidden;
      img {
        width: 100%;
        height: auto;
      }
      .desc {
        margin: 8px;
        text-indent: 20px;
        font-size: 15px;
      }
      .userName {
        margin-left: 8px;
        color: #999;
        font-size: 13px;
      }
      .time {
        color: #999;
        font-size: 13px;
        margin: 0 8px 8px 8px;
      }
    }
  }
}
</style>